<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<!-- BEGIN HEAD -->
<head>
    <meta charset="utf-8"/>
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta content="width=device-width, initial-scale=1" name="viewport"/>
    <meta name="description" content="Responsive Admin Template"/>
    <meta name="author" content="SmartUniversity"/>
    <title>Spice Hotel | Bootstrap 4 Admin Dashboard Template + UI Kit</title>
    <!-- google font -->
    <link href="https://fonts.googleapis.com/css?family=Poppins:300,400,500,600,700" rel="stylesheet" type="text/css"/>
    <!-- icons -->
    <link th:href="@{/assets/plugins/simple-line-icons/simple-line-icons.min.css}" rel="stylesheet" type="text/css"/>
    <link th:href="@{/assets/plugins/font-awesome/css/font-awesome.min.css}" rel="stylesheet" type="text/css"/>
    <!--bootstrap -->
    <link th:href="@{/assets/plugins/bootstrap/css/bootstrap.min.css}" rel="stylesheet" type="text/css"/>
    <!-- Material Design Lite CSS -->
    <link rel="stylesheet" th:href="@{/assets/plugins/material/material.min.css}">
    <link rel="stylesheet" th:href="@{/assets/css/material_style.css}">
    <!-- animation -->
    <link th:href="@{/assets/css/pages/animate_page.css}" rel="stylesheet">
    <!-- Template Styles -->
    <link th:href="@{/assets/css/style.css}" rel="stylesheet" type="text/css"/>
    <link th:href="@{/assets/css/plugins.min.css}" rel="stylesheet" type="text/css"/>
    <link th:href="@{/assets/css/responsive.css}" rel="stylesheet" type="text/css"/>
    <link th:href="@{/assets/css/theme-color.css}" rel="stylesheet" type="text/css"/>
    <!-- favicon -->
    <link rel="shortcut icon" th:href="@{/assets/img/favicon.ico}"/>
</head>
<!-- END HEAD -->
<body class="page-header-fixed sidemenu-closed-hidelogo page-content-white page-md header-white dark-sidebar-color logo-dark">
<div class="page-wrapper">
    <!-- start header -->
    <div th:replace="~{commons::headnavbar}"></div>
    <!-- end header -->
    <!-- start page container -->
    <div class="page-container">
        <!-- start sidebar menu -->
        <div th:replace="~{commons::sidebar}"></div>
        <!-- end sidebar menu -->
        <!-- start page content -->
        <div class="page-content-wrapper">
            <div class="page-content">
                <div class="page-bar">
                    <div class="page-title-breadcrumb">
                        <div class=" pull-left">
                            <div class="page-title">用户面板</div>
                        </div>
                        <ol class="breadcrumb page-breadcrumb pull-right">
                            <li><i class="fa fa-home"></i>&nbsp;<a class="parent-item" href="index.html">主页</a>&nbsp;<i
                                    class="fa fa-angle-right"></i>
                            </li>
                            <li><a class="parent-item" href="">用户</a>&nbsp;<i class="fa fa-angle-right"></i>
                            </li>
                            <li class="active">用户面板</li>
                        </ol>
                    </div>
                </div>

                <div class="row">
                    <div class="col-md-12">


                        <!-- BEGIN PROFILE CONTENT -->
                        <div class="profile-content">
                            <div class="row">
                                <div class="profile-tab-box">
                                    <div class="p-l-20">
                                        <ul class="nav ">
                                            <li class="nav-item tab-all"><a
                                                    class="nav-link active show" href="#tab1" data-toggle="tab">关于
                                            </a></li>

                                            <li class="nav-item tab-all p-l-20"><a class="nav-link"
                                                                                   href="#tab3"
                                                                                   data-toggle="tab">密码设置</a>
                                            </li>
                                        </ul>
                                    </div>
                                </div>

                                <div class="white-box">
                                    <!-- Tab panes -->
                                    <div class="tab-content">
                                        <div class="tab-pane active fontawesome-demo" id="tab1">
                                            <div id="biography">
                                                <div class="row">
                                                    <div class="col-md-3 col-6 b-r"><strong>姓名</strong>
                                                        <br>
                                                        <p class="text-muted">夏烨</p>
                                                    </div>
                                                    <div class="col-md-3 col-6 b-r"><strong>手机</strong>
                                                        <br>
                                                        <p class="text-muted">(123) 456 7890</p>
                                                    </div>
                                                    <div class="col-md-3 col-6 b-r"><strong>邮箱</strong>
                                                        <br>
                                                        <p class="text-muted">johndeo@example.com</p>
                                                    </div>
                                                    <div class="col-md-3 col-6"><strong>地址</strong>
                                                        <br>
                                                        <p class="text-muted">中国</p>
                                                    </div>
                                                </div>
                                                <hr>
<!--                                                <br>-->
<!--                                                <h4 class="font-bold">教育背景</h4>-->
<!--                                                <hr>-->
<!--                                                <ul>-->
<!--                                                    <li>本科：南京信息工程学</li>-->
<!--                                                    <li>硕士：无</li>-->
<!--                                                    <li>博士：无</li>-->
<!--                                                </ul>-->
<!--                                                <br>-->
<!--                                                <h4 class="font-bold">工作经验</h4>-->
<!--                                                <hr>-->
<!--                                                <ul>-->
<!--                                                    <li>-->
<!--                                                        xxxxxx工作年限一年-->
<!--                                                    </li>-->
<!--                                                </ul>-->
<!--                                                <br>-->

<!--                                                <br>-->
                                            </div>
                                        </div>

                                        <div class="tab-pane" id="tab3">
                                            <div class="row">
                                                <div class="col-md-12 col-sm-12">
                                                    <div class="card-head">
                                                        <header>修改密码</header>
                                                        <button id="panel-button2"
                                                                class="mdl-button mdl-js-button mdl-button--icon pull-right"
                                                                data-upgraded=",MaterialButton">
                                                            <i class="material-icons">more_vert</i>
                                                        </button>
                                                        <ul class="mdl-menu mdl-menu--bottom-right mdl-js-menu mdl-js-ripple-effect"
                                                            data-mdl-for="panel-button2">
                                                            <li class="mdl-menu__item"><i class="material-icons">assistant_photo</i>Action
                                                            </li>
                                                            <li class="mdl-menu__item"><i
                                                                    class="material-icons">print</i>Another action
                                                            </li>
                                                            <li class="mdl-menu__item"><i class="material-icons">favorite</i>Something
                                                                else here
                                                            </li>
                                                        </ul>
                                                    </div>
                                                    <div class="card-body " id="bar-parent1">
                                                        <form id="pwdForm">
                                                            <div class="form-group">
                                                                <label for="simpleFormName">用户名</label>
                                                                <input type="text" class="form-control"
                                                                       name="username"
                                                                       id="simpleFormName"
                                                                       th:value="${session.loginUser.getUsername()}"
                                                                       placeholder="Enter user name">
                                                            </div>
                                                            <div class="form-group">
                                                                <label for="simpleFormPassword">当前密码</label>
                                                                <input type="password" class="form-control"
                                                                       name="password"
                                                                       id="simpleFormPassword"
                                                                       placeholder="Current Password">
                                                            </div>
                                                            <div class="form-group">
                                                                <label for="simpleFormPassword">新密码</label>
                                                                <input type="password" class="form-control"
                                                                       name="newPassword"
                                                                       id="newPassword" placeholder="New Password">
                                                            </div>
                                                            <div  class="form-group">
                                                                <span id="pwdMsg" style="color: red"></span>
                                                            </div>
                                                            <button  type="button" class="btn btn-primary" id="changePwd">提交
                                                            </button>
                                                        </form>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <!-- END PROFILE CONTENT -->

                    </div>
                </div>
            </div>
            <!-- end page content -->

            <!-- start chat sidebar -->
            <div th:replace="~{commons::settingtools}"></div>

            <!-- end chat sidebar -->
        </div>
        <!-- end page container -->
        <!-- start footer -->
        <div th:replace="~{commons::footer}"></div>
        <!-- end footer -->
    </div>
</div>
<!-- start js include path -->
<script th:src="@{/assets/plugins/jquery/jquery.min.js}"></script>
<script th:src="@{/assets/plugins/popper/popper.min.js}"></script>
<script th:src="@{/assets/plugins/jquery-blockui/jquery.blockui.min.js}"></script>
<script th:src="@{/assets/plugins/jquery-slimscroll/jquery.slimscroll.min.js}"></script>
<!-- bootstrap -->
<script th:src="@{/assets/plugins/bootstrap/js/bootstrap.min.js}"></script>
<!-- Common js-->
<script th:src="@{/assets/js/app.js}"></script>
<script th:src="@{/assets/js/layout.js}"></script>
<script th:src="@{/assets/js/theme-color.js}"></script>
<!-- Material -->
<script th:src="@{/assets/plugins/material/material.min.js}"></script>
<!-- animation -->
<script th:src="@{/assets/js/pages/ui/animations.js}"></script>
<!-- end js include path -->
<script th:src="@{/assets/js/pages/extra_pages/user_profile.js}"></script>
</body>
</html>
